<template>
  <el-container id="containerAdminMain">
    <el-header id="headerAdminMain">
      <el-menu
          default-active=1
          class="el-menu-demo"
          mode="horizontal"
          background-color="#545c64"
          text-color="#fff"
          active-text-color="#ffd04b"
          id="menu"
      >
        <el-menu-item class="admin_wrap" @click="$router.push('/adminMain/Main')">
          <img class="admin_logo" src="../../assets/img/admin_logo.png"/>
        </el-menu-item>

        <el-submenu index="6" style="float: right">
          <template slot="title">
            <i class="el-icon-more"></i>
          </template>
          <el-menu-item index="6-1">
            <i class="el-icon-user-solid"></i>个人信息
          </el-menu-item>
          <el-menu-item index="6-4">
            <i class="el-icon-s-tools"></i>设置
          </el-menu-item>
          <el-menu-item index="6-6" @click="logout">
            <i class="el-icon-switch-button"></i>退出
          </el-menu-item>
        </el-submenu>

        <el-menu-item index="5" style="float: right">
          <div class="block">
            <el-avatar :size="45" src="https://masteryan.oss-cn-beijing.aliyuncs.com/admin.jpg"></el-avatar>
          </div>
        </el-menu-item>

      </el-menu>
    </el-header>

    <el-container>
      <el-aside width="12%" style="height: 100%;background-color: #545C64">
        <el-menu
            default-active="1"
            class="el-menu-vertical-demo"
            background-color="#545c64"
            text-color="#fff"
            active-text-color="#ffd04b"
        >
          <el-submenu index="1">
            <template slot="title">
              <i class="el-icon-user-solid"></i>
              <span>用户管理</span>
            </template>
            <el-menu-item-group>
              <el-menu-item index="1-1" @click="$router.push('/adminMain/adminUser')"> 普通用户</el-menu-item>
              <el-menu-item index="1-2" @click="$router.push('/adminMain/adminVipUser')"> VIP用户</el-menu-item>
              <el-menu-item index="1-3" @click="$router.push('/adminMain/adminBlackListUser')"> 黑名单用户</el-menu-item>
            </el-menu-item-group>
          </el-submenu>

          <el-submenu index="2">
            <template slot="title">
              <i class="el-icon-folder"></i>
              <span>任务管理</span>
            </template>
            <el-menu-item-group>
              <el-menu-item index="2-1" @click="$router.push('/adminMain/adminReview')"> 任务审核</el-menu-item>
              <el-menu-item index="2-2" @click="$router.push('/adminMain/adminPassTask')"> 通过的任务</el-menu-item>
              <el-menu-item index="2-3" @click="$router.push('/adminMain/adminRefuseTask')"> 拒绝的任务</el-menu-item>
            </el-menu-item-group>
          </el-submenu>

          <el-submenu index="3">
            <template slot="title">
              <i class="el-icon-s-order"></i>
              <span slot="title">订单管理</span>
            </template>
            <el-menu-item-group>
              <el-menu-item index="3-1" @click="$router.push('/adminMain/adminSettlementOrder')"> 结算订单</el-menu-item>
              <el-menu-item index="3-2" @click="$router.push('/adminMain/adminRefuseOrder')">退款订单</el-menu-item>
              <el-menu-item index="3-3" @click="$router.push('/adminMain/adminOrder')">订单详情</el-menu-item>
            </el-menu-item-group>
          </el-submenu>

          <el-submenu index="4">
            <template slot="title">
              <i class="el-icon-s-data"></i>
              <span slot="title">数据统计</span>
            </template>
            <el-menu-item-group>
              <el-menu-item index="4-1" @click="$router.push('/adminMain/userStatistic')"> 用户数据</el-menu-item>
              <el-menu-item index="4-2" @click="$router.push('/adminMain/taskStatistic')">任务数据</el-menu-item>
              <el-menu-item index="4-3" @click="$router.push('/adminMain/orderStatistic')">订单数据</el-menu-item>
            </el-menu-item-group>
          </el-submenu>
        </el-menu>
      </el-aside>

      <el-main style="width:100%;height:100%;padding: 3px">
        <router-view></router-view>
      </el-main>

    </el-container>

  </el-container>
</template>

<script>
export default {
  name: "login",
  methods: {
    logout() {
      window.sessionStorage.removeItem('token')
      this.$router.push('/adminLogin')
    }
  }
}
</script>

<style scoped>
#containerAdminMain {
  width: 100%;
  height: 100%;
  background-color: #f7f7f7;
}
.admin_wrap{
  width: 227px!important;
  position: relative;
  z-index: 99;
  box-shadow:-5px 5px 10px -4px #3f3f3f;
}
.admin_logo{
  margin-left: 30px;
}
#headerAdminMain {
  padding: 0 0px;
  background-color: #545C64;
}

</style>